<template>
    <Content title="验收">
        <view class="quality-confirmation-box">
            <u-form labelPosition="left" :model="model" labelWidth="120" labelAlign="left" :rules="rules" ref="uForm">
                <u-form-item label="服务态度评分：" prop="serviceAttitudeScore" required>
                    <uni-rate :max="5" v-model="model.serviceAttitudeScore" />
                </u-form-item>
                <u-form-item label="技术能力评分：" prop="technicalSkillsScore" required>
                    <uni-rate :max="5" v-model="model.technicalSkillsScore" />
                </u-form-item>
                <u-form-item label="响应速度评分：" prop="responseSpeedScore" required>
                    <uni-rate :max="5" v-model="model.responseSpeedScore" />
                </u-form-item>
                <!-- <u-form-item label="评语：" prop="evaluate">
                    <u-textarea v-model="model.evaluate" placeholder="请输入"></u-textarea>
                </u-form-item> -->
                <view class="btn-v">
                    <view class="but-box">
                        <u-button class="btn" @click="close" text="取消"></u-button>
                        <u-button class="btn" type="primary" @click="submit" text="确定" :loading="loading"></u-button>
                    </view>
                </view>
            </u-form>
        </view>
    </Content>
</template>

<script>
    import Content from "@/components/content/index.vue";
    import fetch from "@/utils/fetch";
    export default {
        components: {
            Content,
        },
        data() {
            return {
                id: "",
                loading: false,
                model: {
                    serviceAttitudeScore: "",
                    technicalSkillsScore: "",
                    responseSpeedScore: "",
                    // evaluate: "",
                },
                rules: {
                    serviceAttitudeScore: {
                        required: true,
                        message: "请填写",
                        trigger: "change",
                    },
                    technicalSkillsScore: {
                        required: true,
                        message: "请填写",
                        trigger: "change",
                    },
                    responseSpeedScore: {
                        required: true,
                        message: "请填写",
                        trigger: "change",
                    }
                },
            };
        },
        watch: {
            loading(val) {
                if (val)
                    uni.showLoading({
                        mask: true
                    });
                uni.hideLoading();
            }
        },
        onLoad: function(option) {
            //option为object类型，会序列化上个页面传递的参数
            this.id = parseInt(option.id);
        },
        mounted() {},
        methods: {
            close() {
                uni.navigateBack({
                    delta: 1, //返回上一页
                });
            },
            submit() {
                if (!this.model.serviceAttitudeScore) {
                    uni.$emit("openToast", {
                        type: "error",
                        title: "服务态度评分不能为空",
                    });
                    return;
                }
                if (!this.model.technicalSkillsScore) {
                    uni.$emit("openToast", {
                        type: "error",
                        title: "技术能力评分不能为空",
                    });
                    return;
                }
                if (!this.model.responseSpeedScore) {
                    uni.$emit("openToast", {
                        type: "error",
                        title: "响应速度评分不能为空",
                    });
                    return;
                }
                const that = this;
                that.loading = true;
                fetch("post", "/dms/mobile/maintainTask/confirm", {
                    taskId: this.id,
                    ...this.model,
                }).then((res) => {
                    uni.$emit("openToast", {
                        type: "success",
                        title: "确认完成",
                        complete() {
                            uni.navigateBack({
                                delta: 1, //返回上一页
                            });
                        },
                    });
                }).catch(() => {
                    that.loading = false;
                });
            },
        },
    };
</script>

<style scoped lang="scss">
    .quality-confirmation-box {
        padding: 40rpx;
        background-color: #fff;
        min-height: 100%;
    }
</style>